<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

    <script>
        // indexOf：用来获取某个元素在数组中的下标，如果没有在数组里就得到-1
        // let nums = [10, 20, 30, 40, 50]
        // console.log(nums.indexOf(99)) // -1
        // console.log(nums.indexOf(30)) // 2
    

        // indexOf用在基本类型的数组中很有用，但是复杂类型的数组无效

        // 复杂类型之间比较，他比较的是地址
        // {}其实是字面量写法，他相当于写的是 new Object()
        // 每次执行new关键字都会开辟新的堆空间，所以也就意味着，每写一次{}都是开辟新的堆空间
        // console.log( {} == {} ) // false
        // console.log( {name: 'jack', age: 16} == {name: 'jack', age: 16} )  // false

        // [] 是字面量形式，本质上是new Array
        // console.log([] == []) // false

        // let obj1 = {}
        // let obj2 = obj1 
        // // 因为他们指向同一个地址所以是true
        // console.log(obj1 == obj2) // true

        let arr = [
            { id: 11, name: 'jack' },
            { id: 22, name: 'jack2' },
            { id: 33, name: 'jack3' },
        ]

        // // 我要找jack2的下标
        // // 下面永远得到-1，因为这里永远都是新的对象，肯定找不到之前的对象
        // console.log(arr.indexOf( { id: 2, name: 'jack2' } )) // -1


        // 但是就是要找复杂类型数组里的下标
        // 所以此时此刻要用findIndex
        // 首先他用的forEach是一样，都能进行遍历，但是如果return true就不往下遍历了
        // 并且这个方法有返回值，forEach没有返回值
        // 这个返回值就是在你return true时的下标，如果从来没return过true，代表没找到就得到-1
        // let res = arr.findIndex(v => {
        //     console.log(v)
        //     if (v.id == 33) {
        //         return true
        //     }
        // })

        let res = arr.findIndex(v => v.id == 33)
        console.log(res)


        // find跟findIndex一模一样，区别仅仅在于，find返回找到的那个元素，找不到返回undefined
        // findIndex是返回找到的元素的下标，找不得到-1
        let res2 = arr.find(v => v.id == 33)
        console.log(res2) //  { id: 33, name: 'jack3' }

        console.log( arr.find(v => v.id == 99)) // undefined
    </script>
</body>

</html>